<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <title>随手快递</title>
    <link rel="stylesheet" type="text/css" href="../../AUI/css/aui.css" />
    <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
    <script type="text/javascript" src="../../AUI/script/api.js" ></script>
    <script src="../../myJs/jquery.js"></script>
    <script src="http://cache.amap.com/lbs/static/es5.min.js"></script>
    <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=a37424dd342449fb8ab5f809081e01ce&plugin=AMap.Geocoder"></script>
    <script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
    <style>
        .amap-icon img{
            width: 22px;
        }
        .amap-geo{
            display: none;
        }
        .note{
         position: fixed;
            top: 45px;
            height:30px;
            width: 100%;
            background-color: rgba(66, 81, 93, 0.81);
            color: #fff;
            font-size: 13px;
            z-index: 9999;
            padding-left: 15px;
            line-height: 30px;
        }
            /*遮罩层*/

        .z_mask {
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, .5);
            position: fixed;
            top: 0;
            left: 0;
            z-index: 999;
            display: none;
        }

        .z_alert {
            width:70%;
            height: 100px;
            border-radius: .2rem;
            background: #fff;
            font-size:15px;
            text-align: center;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
        }

        .z_alert p:nth-child(1) {
            line-height: 70px;
        }

        .z_alert p:nth-child(2) span {
            display: inline-block;
            width: 49%;
            height: 28px;
            line-height: 28px;
            float: left;
            border-top: 1px solid #ddd;
        }

        .z_sure {
            border-right: 1px solid #ddd;
        }
    </style>
</head>
<body >
<div class="z_mask" id="m6">
    <!--弹出框-->
    <div class="z_alert">
        <span style="line-height: 33px"><div style="margin-top: 5px">确定要向用户“旧事不挽”<br>发布请求订单吗？</div></span>
        <p>
            <span class="z_sure" id="s6">确定</span>
            <span class="z_cancel">取消</span>
        </p>
    </div>
</div>
<header class="aui-bar aui-bar-nav" id="aui-header" >
    <a class="aui-btn aui-pull-left" tapmode onclick="history.back();">
        <span class="aui-iconfont aui-icon-left"></span>
    </a>
    <div class="aui-title" onclick="appoint()">订单地图</div>
</header>
<div id='container'></div>
<div id="tip" style="display: none"></div>
<div class="button-group" style="display:none;">
    <input id="setFitView" class="button" type="button" value="地图自适应显示"/>
</div>
<div class="info-tip">
    <div id="centerCoord"></div>
    <div id="tips"></div>
</div>
<div class="note">注：阳光模式下，表示该用户乐于接单~</div>
<script>
    var geolocation;
    var map = new AMap.Map('container', {
        resizeEnable: true,
        center:[120.373354,30.314091],
        zoom: 13
    });

    map.plugin('AMap.Geolocation', function() {
        geolocation = new AMap.Geolocation({
            enableHighAccuracy: true,//是否使用高精度定位，默认:true
            timeout: 10000,          //超过10秒后停止定位，默认：无穷大
            buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
            zoomToAccuracy: true,      //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
            buttonPosition:'RB'
        });
        map.addControl(geolocation);
        geolocation.getCurrentPosition();
        AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
        AMap.event.addListener(geolocation, 'error', onError);      //返回定位出错信息
    });
    //解析定位结果
    function onComplete(data) {
        var str=['定位成功'];
        str.push('经度：' + data.position.getLng());
        str.push('纬度：' + data.position.getLat());
        if(data.accuracy){
            str.push('精度：' + data.accuracy + ' 米');
        }//如为IP精确定位结果则没有精度信息
        str.push('是否经过偏移：' + (data.isConverted ? '是' : '否'));
        document.getElementById('tip').innerHTML = str.join('<br>');
    }
    //解析定位错误信息
    function onError(data) {
        document.getElementById('tip').innerHTML = '定位失败';
    }
    map.clearMap();  // 清除地图覆盖物
    var markers = [{
        icon: '../../myImage/order.png',
        position: [120.343399,30.32076]
    }, {
        icon: '../../myImage/order.png',
        position: [120.34666,30.313498]
    }, {
        icon: '../../myImage/order.png',
        position: [120.342111,30.306163]
    },{
        icon: '../../myImage/order.png',
        position: [120.325718,30.298752]
    }, {
        icon: '../../myImage/order.png',
        position: [120.316105,30.301865]
    }, {
        icon: '../../myImage/sun.png',
        position: [120.373354,30.314091]
    },{
        icon: '../../myImage/order.png',
        position: [120.363912,30.313869]
    }, {
        icon: '../../myImage/order.png',
        position: [120.381508,30.303347]
    }, {
        icon: '../../myImage/sun.png',
        position: [120.390091,30.300644]
    }, {
        icon: '../../myImage/order.png',
        position: [120.386271,30.313647]
    }, {
        icon: '../../myImage/order.png',
        position: [120.383052,30.308497]
    }];
    // 添加一些分布不均的点到地图上,地图上添加三个点标记，作为参照
    markers.forEach(function(marker) {
        new AMap.Marker({
            map: map,
            icon: marker.icon,
            position: [marker.position[0], marker.position[1]],
            offset: new AMap.Pixel(-12, -36),
              
        });
       
    });  
var center = map.getCenter();
    var centerText = '当前中心点坐标：' + center.getLng() + ',' + center.getLat();
    document.getElementById('centerCoord').innerHTML = centerText;
    document.getElementById('tips').innerHTML = '成功添加三个点标记，其中有两个在当前地图视野外！';

    // 添加事件监听, 使地图自适应显示到合适的范围
    AMap.event.addDomListener(document.getElementById('setFitView'), 'click', function() {
        var newCenter = map.setFitView();
        document.getElementById('centerCoord').innerHTML = '当前中心点坐标：' + newCenter.getCenter();
        document.getElementById('tips').innerHTML = '通过setFitView，地图自适应显示到合适的范围内,点标记已全部显示在视野中！';
    });
    
  function appoint(){
  $("#m6").show();
  }
    $(".z_cancel").on("click",function(){
        $(".z_mask").hide();

    }) ;
     $("#s6").on("click",function(){
        location.href='../helpMe/appointPub.html';

    });
</script>
<!--<script type="text/javascript">
    /***************************************
     由于Chrome、IOS10等已不再支持非安全域的浏览器定位请求，为保证定位成功率和精度，请尽快升级您的站点到HTTPS。
     ***************************************/
    var map, geolocation;
    //加载地图，调用浏览器定位服务
    map = new AMap.Map('container', {
        resizeEnable: true
    });
    map.plugin('AMap.Geolocation', function() {
        geolocation = new AMap.Geolocation({
            enableHighAccuracy: true,//是否使用高精度定位，默认:true
            timeout: 10000,          //超过10秒后停止定位，默认：无穷大
            buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
            zoomToAccuracy: true,      //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
            buttonPosition:'RB'
        });
        map.addControl(geolocation);
        geolocation.getCurrentPosition();
        AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
        AMap.event.addListener(geolocation, 'error', onError);      //返回定位出错信息
    });
    //解析定位结果
    function onComplete(data) {
        var str=['定位成功'];
        str.push('经度：' + data.position.getLng());
        str.push('纬度：' + data.position.getLat());
        if(data.accuracy){
            str.push('精度：' + data.accuracy + ' 米');
        }//如为IP精确定位结果则没有精度信息
        str.push('是否经过偏移：' + (data.isConverted ? '是' : '否'));
        document.getElementById('tip').innerHTML = str.join('<br>');
    }
    //解析定位错误信息
    function onError(data) {
        document.getElementById('tip').innerHTML = '定位失败';
    }
</script>-->
</body>
</html>